<!--
 * @Descripttion: 系统计划任务配置
 * @version: 1.2
 * @Author: sakuya
 * @Date: 2021年7月7日09:28:32
 * @LastEditors: sakuya
 * @LastEditTime: 2021年7月10日20:56:47
-->

<template>
  <sc-dialog :title="titleMap[mode]" v-model="visible" :width="1000" :show-fullscreen="true" destroy-on-close @closed="$emit('closed')">
    <el-main class="nopadding">
      <el-tabs tab-position="left" class="demo-tabs">
        <el-tab-pane class="tab-panel" label="知识库配置"
          ><el-form :model="form" :rules="rules" ref="dialogForm" label-width="120px" label-position="left">
            <el-form-item label="名称" prop="name">
              <el-input v-model="form.name" placeholder="名称" clearable></el-input>
            </el-form-item>

            <el-form-item label="模型" prop="model">
              <el-select v-model="form.model" filterable style="width: 100%" :allow-create="true">
                <el-option-group v-for="group in modelList" :key="group.code" :label="group.name">
                  <el-option v-for="item in group.models" :key="item" :label="item" :value="item" />
                </el-option-group>
              </el-select>
            </el-form-item>
            <el-form-item label="嵌入模型" prop="embeddingModel">
              <el-select v-model="form.embeddingModel" filterable style="width: 100%" :allow-create="true">
                <el-option-group v-for="group in modelList" :key="group.code" :label="group.name">
                  <el-option v-for="item in group.models" :key="item" :label="item" :value="item" />
                </el-option-group>
              </el-select>
            </el-form-item>

            <el-form-item label="开场白" prop="opener">
              <el-input v-model="form.opener" placeholder="开场白" clearable type="textarea" :rows="4"></el-input>
            </el-form-item>
            <el-form-item label="提示词" prop="prompt">
              <el-input v-model="form.prompt" placeholder="提示词" clearable type="textarea" :rows="4"></el-input>
            </el-form-item>
            <el-form-item label="未找到回复模版" prop="noReplyFoundTemplate">
              <el-input v-model="form.noReplyFoundTemplate" placeholder="未找到回复模版" clearable type="textarea" :rows="4"></el-input>
            </el-form-item>
            <el-form-item label="" prop="">
              <el-collapse v-model="activeNames" @change="handleChange" style="width: 100%">
                <el-collapse-item class="collapse-item" title="高级设置" name="1">
                  <el-form :model="form" :rules="rules" label-width="120px" label-position="left">
                    <el-form-item class="margin-form-item" label="温度（AI智商）" prop="temperature">
                      <el-slider class="slider-ai" v-model="form.temperature" :min="0" :max="100" :step="1" />
                    </el-form-item>
                    <el-form-item class="margin-form-item" label="响应token上限" prop="maxResponseToken">
                      <el-slider class="slider-ai" v-model="form.maxResponseToken" :min="0" :max="128000" :step="1" />
                    </el-form-item>

                    <el-form-item class="margin-form-item" label="引用token上限" prop="referenceUpperLimit">
                      <el-slider class="slider-ai" v-model="form.referenceUpperLimit" :min="100" :max="128000" :step="1" />
                    </el-form-item>

                    <el-form-item class="margin-form-item" label="向量匹配相似" prop="relevancy">
                      <el-slider class="slider-ai" v-model="form.relevancy" :min="0" :max="1" :step="0.1" />
                    </el-form-item>

                    <el-form-item class="margin-form-item" label="引用模板提示词" prop="template">
                      <el-input v-model="form.template" placeholder="引用模板提示词" clearable type="textarea" :rows="4"></el-input>
                    </el-form-item>
                  </el-form>
                </el-collapse-item>
                <el-collapse-item class="collapse-item" title="图像分析设置" name="2" v-if="form.chatType == 'images'">
                  <el-form :model="form" :rules="rules" label-width="120px" label-position="left">
                    <el-form-item label="图像分析模型" prop="imageAnalysisModel">
                      <el-select v-model="form.imageAnalysisModel" filterable style="width: 100%" :allow-create="true" clearable>
                        <el-option-group v-for="group in modelList" :key="group.code" :label="group.name">
                          <el-option v-for="item in group.models" :key="item" :label="item" :value="item" />
                        </el-option-group>
                      </el-select>
                    </el-form-item>
                    <el-form-item class="margin-form-item" label="分析提示词" prop="imageAnalysisPrompt">
                      <el-input v-model="form.imageAnalysisPrompt" placeholder="分析提示词" clearable type="textarea" :rows="4"></el-input>
                    </el-form-item>
                  </el-form>
                </el-collapse-item>
                <el-collapse-item class="collapse-item" title="关联FunctionCall" name="3">
                  <div>Simplify the process: keep operating process simple and intuitive;</div>
                  <div>Definite and clear: enunciate your intentions clearly so that the users can quickly understand and make decisions;</div>
                  <div>
                    Easy to identify: the interface should be straightforward, which helps the users to identify and frees them from memorizing and recalling.
                  </div>
                </el-collapse-item>
              </el-collapse>
            </el-form-item>
            <el-form-item label="" prop="showSourceFile">
              <el-checkbox v-model="form.showSourceFile" label="是否启用引用来源显示" size="large" />
            </el-form-item>
            <el-form-item label="" prop="showSourceFile">
              <el-button type="warning" style="width: 100%" :loading="isSaveing" @click="submit()">保存修改</el-button>
            </el-form-item>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="管理提问">管理提问</el-tab-pane>
        <el-tab-pane label="发布应用">发布应用</el-tab-pane>
      </el-tabs>
    </el-main>
  </sc-dialog>
</template>

<script>
import scCron from '@/components/scCron';

export default {
  name: 'AIKnowledgenManageUpdateSave',
  components: {
    scCron,
  },
  emits: ['success', 'closed'],
  data() {
    return {
      mode: 'add',
      titleMap: {
        add: '新增知识库',
        edit: '编辑知识库',
      },
      form: {
        name: '',
        model: '',
        embeddingModel: '',
      },
      rules: {
        name: [
          {
            required: true,
            message: '请输入名称',
            trigger: 'blur',
          },
        ],
        model: [
          {
            required: true,
            message: '请选择模型',
            trigger: 'blur',
          },
        ],
        embeddingModel: [
          {
            required: true,
            message: '请选择嵌入模型',
            trigger: 'blur',
          },
        ],
      },
      visible: false,
      isSaveing: false,
      chatTypelList: [
        {
          code: 'ai-chat',
          name: 'chat',
          items: ['chat'],
        },
        {
          code: 'ai-images',
          name: 'images',
          items: ['images'],
        },
      ],
    };
  },
  async mounted() {},
  methods: {
    async loadAIModels() {
      let response = await this.$API.aiModel.list.get('');

      this.modelList = response.data;
    },

    //显示
    open(mode = 'add') {
      this.loadAIModels();
      this.mode = mode;
      this.visible = true;
      return this;
    },
    //表单提交方法
    submit() {
      this.$refs.dialogForm.validate(async valid => {
        if (valid) {
          this.isSaveing = true;
          var res;

          res = await this.$API.aiWiki.update.post(this.form);

          this.isSaveing = false;
          if (res.code == 200) {
            this.$emit('success');
            this.visible = false;
            this.$message.success('操作成功');
          } else {
            this.$alert(res.message, '提示', { type: 'error' });
          }
        }
      });
    },
    //表单注入数据
    setData(data) {
      // let deepCopiedObject = JSON.parse(JSON.stringify(data));
      // this.form.name = deepCopiedObject.name;
      this.loadDetail(data.id);
    },
    async loadDetail(id) {
      var res = await this.$API.aiWiki.detail.post(id);
      if (res.code == 200) {
        this.form = res.data;
      }
    },
  },
};
</script>

<style>
.tab-panel {
  /* height: 100%; */
  overflow-y: auto;
  overflow-x: hidden;
}

.collapse-item {
  /* background-color: rgba(0, 0, 0, 0.1); */
}
.slider-ai {
  width: 98% !important;
}
.margin-form-item {
  margin-top: 15px;
}
</style>
